<template>
	<view :class="['page',{'iphoneX':isIphoneX}]">  
		<view  class="body">
			<view class="h45">
				<view class="fix-wrap"> 
					<view class="search-area">
						<view class="search-form">
							<view class="icon iconfont f-s44">&#xe622;</view>
							<input type="text" confirm-type="search" v-model="params.keyword" class="sc-inp" @confirm="search">
							<view v-if="params.keyword" class="clear-btn iconfont f-s44" @click="clearKeyword">&#xe724;</view>
						</view>  
					</view> 
				</view>
			</view> 
			
			<view class="f-s28 m-t2 m-l2">如需添加产品，请联系仓管审批员：何凯	</view>
			<template >
				<template v-if="list.length>0">
					<view v-if="type==1" class="list-wrap">
						<view class="item" v-for="(item,index) in list" :key="index">
							<navigator :url="'/package_kucun/add/add?type='+type+'&page=detail&id='+item.id" hover-class="none" >
								<view class="row-2">
									<text>产品名称</text>
									<text>{{item.pname}}</text>
								</view>
								<view v-if="userInfo.role_id!=24" class="row-2">
									<text>总数量</text>
									<text>{{item.total_count}}</text>
								</view>
							</navigator>
							<view class="row-2 btn-wrap">
								<navigator v-if="auth.indexOf(21)!=-1" :url="'/package_kucun/add/add?type='+type+'&page=edit&id='+item.id" hover-class="none" class="btn">编辑产品</navigator> 
								<navigator :url="'/package_kucun/add/add?type='+type+'&page=detail&id='+item.id" hover-class="none" class="btn">详情</navigator>  
							</view>
						</view>
						<c-loading :loadingState="loadingState"></c-loading>
					</view> 
					
					<view v-if="type==2" class="list-wrap">
						<view v-if="item.status==1" class="item" v-for="(item,index) in list" :key="index">
							<navigator :url="'/package_kucun/add/add?type='+type+'&page=detail&id='+item.id" hover-class="none" class="btn">
								<view class="row-2">
									<text>材料名称</text>
									<text>{{item.pname}}</text>
								</view>
								<view class="row-2">
									<text>总数量</text>
									<text>{{item.number}}{{item.uname}}</text>
								</view>
							</navigator>
							<view class="row-2 btn-wrap">
								<navigator :url="'/package_kucun/add/add?type='+type+'&page=detail&id='+item.id" hover-class="none" class="btn">详情</navigator>  
								<navigator v-if="auth.indexOf(21)!=-1" :url="'/package_kucun/add/add?type='+type+'&page=edit&id='+item.id" hover-class="none" class="btn">编辑材料</navigator>  
								<view v-if="auth.indexOf(21)!=-1" class="btn" @click="del(item.id)">删除</view>
							</view>
						</view>
						<c-loading :loadingState="loadingState"></c-loading>
					</view> 
				</template> 
				
				<c-empty v-else></c-empty>
			</template>
		</view>  
		<c-footer  > 
			<view slot="content" class="add-btn" @click="add">{{type==1?'新增产品':'新增材料'}}</view>
		</c-footer>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLogin:true, 
				isIphoneX:getApp().globalData.isIphoneX,
				systemInfo:getApp().globalData.systemInfo,
				userInfo:uni.getStorageSync('userInfo'),
				isShowSearch:false,
				type:'', 
				list:[],
				total:0,
				select_filter:{
					name:'消息',
					id:'0',
					key:'type'
				}, 
				loadingState:{
					default:false,
					loading:false,
					completed:false
				},
				params:{
					page:1,
					limit:15,
					cate_id: '',
					keyword:'',
					is_page:1
				},
				auth:''
			}
		},
		onLoad(params) { 
			this.type=params.type;
			if(this.type==1){
				uni.setNavigationBarTitle({
					title:'产品列表'
				}) 
				this.getprojectList();
			}
			if(this.type==2){
				uni.setNavigationBarTitle({
					title:'材料列表'
				})
				this.getpartslist();
			}
			this.getauth();
		},
		onShow() {
			
		},
		onReachBottom(){
			if(this.loadingState.completed){ 
				this.params.page=1;
				return false
			}else{
				this.params.page++;
				if(this.type==1){
					this.getprojectList(); 
				}
				if(this.type==2){
					this.getpartslist(); 
				}
				
				
			}	 
		},
		methods: { 
			async getauth(){
				let res=await this.$api.user_api.getauth(); 
				   console.log(res)
				if(res.data.code==200){    
					this.auth=res.data.data.join(',');
					console.log(this.auth)
				}
			}, 
			
			// 搜索关键词
			search() { 
				this.list = [];
				// this.loadingState={
				// 	default:true,
				// 	loading:false,
				// 	completed:false
				// };
				this.params.page=1;
				if(this.type==1){
					this.getprojectList(); 
				}
				if(this.type==2){
					this.getpartslist(); 
				}
			},
			
			// 清空关键词
			clearKeyword() {
				this.params.keyword = '';
				this.params.page=1;
				// this.loadingState={
				// 	default:true,
				// 	loading:false,
				// 	completed:false
				// };
				this.list = [];
				if(this.type==1){
					this.getprojectList(); 
				}
				if(this.type==2){
					this.getpartslist(); 
				}
			},
			async del(id){
				let _this=this;
				if(this.type==1){
					uni.showModal({
						content:'确定删除该数据吗？',
						async success(data) {
							if(data.confirm){
								let res=await _this.$api.user_api.producttypedel({
									id
								});  
								if(res.data.code==200){
									_this.$store.commit('KUCUN_LIST_UPDATE',1); 
								}
							}
						}
					}) 
				}
				if(this.type==2){
					uni.showModal({
						content:'确定删除该数据吗？',
						async success(data) {
							if(data.confirm){
								let res=await _this.$api.user_api.partsdelpart({
									id
								});   
								if(res.data.code==200){
									_this.$store.commit('KUCUN_LIST_UPDATE',1); 
								}
							}
						}
					}) 
				}
			},
			async getprojectList(){ 
				let {page,limit,cate_id,keyword}=this.params;
				let res=await this.$api.user_api.producttypelist({ 
					page,limit,cate_id,keyword
				});    
				console.log(res)
				if(res.data.code==200){  
					this.list=this.list.concat(res.data.data.list);	
					if(this.list.length==res.data.data.count){
						this.loadingState.completed=true;
					} 
				}
			}, 
			
			async getpartslist(){
				let {page,limit,cate_id,keyword}=this.params;
				let res=await this.$api.user_api.partslist({
					pname:keyword,
					page,
					limit,
					is_page:1
				}); 
				console.log(res)
				if(res.data.code==200){  
					this.list=this.list.concat(res.data.data.list);
					if(this.list.length==res.data.data.count){
						this.loadingState.completed=true;
					} 
				}
			}, 
			
			add(){
				if(this.type==1){
					uni.navigateTo({
						url:'/package_kucun/add/add?type=1&page=add'
					})
				}
				if(this.type==2){
					uni.navigateTo({
						url:'/package_kucun/add/add?type=2&page=add'
					})
				}
			}
			 
		},
		computed:{
			list_update(){
				return this.$store.state.kucun_list;
			}
		},
		watch:{
			list_update(newer,older){ 
				console.log('更新')
				if(newer!=older){
					if(this.type==1){
						this.params.page=1;
						this.list=[];
						this.getprojectList(); 
					}
					if(this.type==2){
						this.params.page=1;
						this.list=[];
						this.getpartslist(); 
					}
				} 
			} 
		}
	}
</script>

<style lang="less" >
	.add-btn{
		height: 36px;
		line-height: 36px;
		width: 60%;
		margin: 5px auto;
		background: #1cab1b;
		border-radius: 8rpx;
		color: #fff;
		font-size: 30rpx;
		text-align: center;
	}  
	.list-wrap{
		padding:20rpx 0;
		.item{ 
			padding:20rpx; 
			background: #fff;  
			border-bottom:5rpx solid #e5e5e5; 
			.row-2{
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 10rpx;
				color: #939393;
				font-size: 30rpx;
			}
			.btn-wrap{
				padding:20rpx 50rpx; 
				border-top: 1rpx solid #e5e5e5;
				.btn{
					padding: 10rpx 20rpx;
					background: #1cab1b;
					border-radius: 8rpx;
					color: #fff;
				}
			}
			 
		}
	}
   
</style>
